<template>
<div id="main-news">
  <div class="news-tab">
    <Menu active-name="1">
        <Menu-group title="消息中心">
            <Menu-item name="1">
                <div @click="need">我的需求</div>
            </Menu-item>
            <Menu-item name="2">
                <div @click="like">收到的赞</div>
            </Menu-item>
            <Menu-item name="3">
                <div @click="message">系统通知</div>
            </Menu-item>
        </Menu-group>
    </Menu>
    </div>
    <div><news-message :needshow='item' :mytips='tips' v-for="(item,index) in myneed" :key="index"/></div>
    </div>
</template>
<script>
import {listBidById} from 'api/message.js'
import NewsMessage from './NewsMessage.vue';
    export default {
      name:'MainNews',
        data () {
            return {
              username:'',
              request:'',
              date:'',
              tips:'',
              myneed:{
                type:Array,
                default(){
                  return [];
                  } 
               }
            }
        },
    components: { 
     NewsMessage 
     },
        created(){
          this.need();
        },
        methods:{
          need(){
            let data={};
            data.userId=sessionStorage.getItem('id');
            listBidById('/api/user/listBidById',data)
            .then(res=>{
              this.$Notice.success({
              title:'获取成功',
              duration:5})
              this.myneed=res.data;
              this.tips='领取了我的需求';
            })
            .catch(err=>{
              this.$Notice.error({
              title:'消息获取失败',
              duration:5})
            })
          },
          like(){
            let data={};
            data.userId=sessionStorage.getItem('id');
            listBidById('/api/user/listLikeById',data)
            .then(res=>{
              this.$Notice.success({
              title:'获取成功',
              duration:5})
              this.myneed=res.data;
              this.tips='点赞了我的模型';
            })
            .catch(err=>{
              this.$Notice.error({
              title:'消息获取失败',
              duration:5})
            })
          },
          message(){}
        }
    }
</script>
<style>
#main-news{
  display: flex;
  width: 100%;
  background-color: #f9f9f9;
  padding: 0 250px;
  min-height: 50rem;
}
#main-news .ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active:not(.ivu-menu-submenu):after{
  background: #8c30f5;
}
#main-news .ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active:not(.ivu-menu-submenu){
  color: #8c30f5;
  background: #f9f0ff;
}
#main-news .ivu-menu-vertical .ivu-menu-item:hover, .ivu-menu-vertical .ivu-menu-submenu-title:hover{
  color: #8c30f5;
}
</style>
